﻿/**
 * 用户管理页面的JavaScript功能
 */

// 在页面加载完成后执行
$(document).ready(function() {
    // 定义分页变量
    var currentPage = 1;
    var pageSize = 10;
    var totalPages = 1;

    // 页面加载时调用API获取用户列表
    loadUserData(currentPage, pageSize);

    // 加载用户数据的函数
    function loadUserData(page, size) {
        $.ajax({
            url: contextPath + '/API/user/list',
            type: 'GET',
            data: {
                pageNum: page,
                pageSize: size
            },
            dataType: 'json',
            success: function(response) {
                // 将获取的数据输出到控制台
                console.log('用户列表数据:', response);

                // 渲染用户数据到表格
                renderUserTable(response.rows);

                // 更新分页信息
                totalPages = Math.ceil(response.total / pageSize);
                renderPagination(currentPage, totalPages);
            },
            error: function(xhr, status, error) {
                console.error('获取用户列表失败:', error);
            }
        });
    }

    // 渲染用户表格的函数
    function renderUserTable(users) {
        var tableBody = $('table.table tbody');
        tableBody.empty(); // 清空现有表格内容

        // 将当前用户数据存到全局变量，便于事件中访问
        window._currentUsers = users;

        // 遍历用户数据并添加到表格
        for(var i = 0; i < users.length; i++) {
            var user = users[i];
            var statusBadge = user.status === 1 ?
                '<span class="badge bg-success">正常</span>' :
                '<span class="badge bg-danger">停用</span>';

            // 处理头像显示
            var avatarDisplay;
            if (user.avatar_url && user.avatar_url.trim() !== '') {
                // 清理可能存在的反引号和多余空格
                var cleanedAvatarUrl = user.avatar_url.replace(/`/g, '').trim();
                avatarDisplay = '<img src="' + cleanedAvatarUrl + '" alt="头像" style="width: 40px; height: 40px; border-radius: 50%; object-fit: cover;">';
            } else {
                avatarDisplay = '<span class="text-muted">暂无数据</span>';
            }

            // 移除角色相关代码
            var row = '<tr>' +
                '<td class="text-center"><input type="checkbox" class="form-check-input"></td>' +
                '<td class="text-center">' + user.username + '</td>' +
                '<td class="text-center">' + avatarDisplay + '</td>' + // 新增头像列的渲染
                '<td class="text-center">' + (user.phone || '<span class="text-muted">空</span>') + '</td>' +
                '<td class="text-center">' + (user.email || '<span class="text-muted">空</span>') + '</td>' +
                '<td class="text-center">' + statusBadge + '</td>' +
                // 移除角色列
                '<td class="text-center">' +
                // 将 data-index 移到 primary 按钮
                '<button class="btn btn-sm btn-primary" data-index="' + i + '"><i class="bi bi-pencil"></i></button> ' +
                '<button class="btn btn-sm btn-danger" data-index="' + i + '"><i class="bi bi-trash"></i></button>' +
                '</td>' +
                '</tr>';

            tableBody.append(row);
        }
        // 关键：渲染完毕后，重置所有复选框为未选中
        $('#selectAll').prop('checked', false); // 全选框
        $('table.table tbody input[type="checkbox"]').prop('checked', false); // 每行checkbox
    }

    // 渲染分页控件
    function renderPagination(currentPage, totalPages) {
        var paginationEl = $('.pagination');
        paginationEl.empty();

        // 上一页按钮
        var prevDisabled = currentPage === 1 ? 'disabled' : '';
        var prevItem = '<li class="page-item ' + prevDisabled + '">' +
            '<a class="page-link prev-page" href="javascript:void(0)" tabindex="-1">上一页</a></li>';
        paginationEl.append(prevItem);

        // 页码按钮
        var startPage = Math.max(1, currentPage - 2);
        var endPage = Math.min(totalPages, startPage + 4);

        if (endPage - startPage < 4 && totalPages > 5) {
            startPage = Math.max(1, endPage - 4);
        }

        for (var i = startPage; i <= endPage; i++) {
            var active = i === currentPage ? 'active' : '';
            var pageItem = '<li class="page-item ' + active + '">' +
                '<a class="page-link page-number" data-page="' + i + '" href="javascript:void(0)">' + i + '</a></li>';
            paginationEl.append(pageItem);
        }

        // 下一页按钮
        var nextDisabled = currentPage === totalPages ? 'disabled' : '';
        var nextItem = '<li class="page-item ' + nextDisabled + '">' +
            '<a class="page-link next-page" href="javascript:void(0)">下一页</a></li>';
        paginationEl.append(nextItem);
    }

    // 绑定分页事件
    $(document).on('click', '.page-number', function() {
        currentPage = parseInt($(this).data('page'));
        loadUserData(currentPage, pageSize);
    });

    $(document).on('click', '.prev-page', function() {
        if (currentPage > 1) {
            currentPage--;
            loadUserData(currentPage, pageSize);
        }
    });

    $(document).on('click', '.next-page', function() {
        if (currentPage < totalPages) {
            currentPage++;
            loadUserData(currentPage, pageSize);
        }
    });

    // 搜索表单提交事件
    $('#searchForm').on('submit', function(e) {
        e.preventDefault();

        // 获取表单数据
        var formData = $(this).serialize();

        // 重要修改：重置当前页码为第1页
        currentPage = 1;

        // 发送AJAX请求
        $.ajax({
            url: contextPath + '/API/user/list',
            type: 'GET',
            data: formData + '&pageNum=' + currentPage + '&pageSize=' + pageSize,
            dataType: 'json',
            success: function(response) {
                // 渲染用户数据到表格
                renderUserTable(response.rows);

                // 更新分页信息
                totalPages = Math.ceil(response.total / pageSize);
                renderPagination(currentPage, totalPages);
            },
            error: function(xhr, status, error) {
                console.error('搜索用户失败:', error);
                showResult('错误', '搜索用户失败，请稍后重试', 'danger');
            }
        });
    });

    // 重置按钮事件
    $('button[type="reset"]').on('click', function() {
        setTimeout(function() {
            currentPage = 1;
            loadUserData(currentPage, pageSize);
        }, 100);
    });

    // 删除warning按钮点击事件绑定
    $(document).on('click', '.warning-btn', function() {
        var index = $(this).data('index');
        if(window._currentUsers && typeof index !== 'undefined') {
            console.log(window._currentUsers[index]);
        }
    });

    // 将事件绑定到 .btn-primary（编辑按钮）
    $(document).on('click', '.btn-primary', function() {
        var index = $(this).data('index');
        if(window._currentUsers && typeof index !== 'undefined') {
            var user = window._currentUsers[index];

            // 填充编辑模态框内容（新增头像预览）
            $('#edit-username').val(user.username);
            $('#edit-password').val('');
            $('#edit-email').val(user.email || '');
            $('#edit-phone').val(user.phone || '');
            $('#edit-status').val(user.status);
            // 加载现有头像预览
            var avatarUrl = user.avatar_url ? user.avatar_url : '';
            $('#edit-avatar-preview').attr('src', avatarUrl);

            // 显示编辑模态框
            var modal = new bootstrap.Modal(document.getElementById('editUserModal'));
            modal.show();
        }
    });

    // 新增：处理头像文件选择的预览
    $(document).on('change', '#edit-avatar', function(e) {
        var file = e.target.files[0];
        if (file && file.type.startsWith('image/')) {
            var reader = new FileReader();
            reader.onload = function(e) {
                $('#edit-avatar-preview').attr('src', e.target.result);
            };
            reader.readAsDataURL(file);
        } else {
            $('#edit-avatar-preview').attr('src', '');
            alert('请选择有效的图片文件');
        }
    });

    // 修改：更新用户按钮点击事件（添加文件上传）
    $('#updateUserBtn').on('click', function() {
        var formData = new FormData();
        formData.append('username', $('#edit-username').val());
        formData.append('password', $('#edit-password').val());
        formData.append('email', $('#edit-email').val());
        formData.append('phone', $('#edit-phone').val());
        formData.append('status', $('#edit-status').val());

        // 添加头像文件
        var avatarFile = $('#edit-avatar')[0].files[0];
        if (avatarFile) {
            formData.append('avatar', avatarFile);
        }

        $.ajax({
            url: contextPath + '/API/user/update',
            type: 'POST',
            data: formData,
            contentType: false,  // 必须设置为false
            processData: false,  // 必须设置为false
            dataType: 'json',
            success: function(response) {
                if (response.code === 200) {
                    // 关闭模态框
                    var modal = bootstrap.Modal.getInstance(document.getElementById('editUserModal'));
                    modal.hide();

                    // 显示成功消息
                    showResult('成功', '用户信息更新成功', 'success');

                    // 重新加载用户数据
                    loadUserData(currentPage, pageSize);
                } else {
                    showResult('错误', response.msg || '更新用户失败', 'danger');
                }
            },
            error: function(xhr, status, error) {
                showResult('错误', '更新用户失败，请稍后重试', 'danger');
            }
        });
    });

    // 添加更新用户到服务器的函数
    function updateUserToServer(requestData) {
        $.ajax({
            url: contextPath + '/API/user/update',
            type: 'POST',
            data: requestData,
            dataType: 'json',
            success: function(response) {
                if (response.code === 200) {
                    // 关闭模态框
                    var modal = bootstrap.Modal.getInstance(document.getElementById('editUserModal'));
                    modal.hide();

                    // 显示成功消息
                    showResult('成功', '用户信息更新成功', 'success');

                    // 重新加载用户数据
                    loadUserData(currentPage, pageSize);
                } else {
                    showResult('错误', response.msg || '更新用户失败', 'danger');
                }
            },
            error: function(xhr, status, error) {
                showResult('错误', '更新用户失败，请稍后重试', 'danger');
            }
        });
    }

    // 添加验证函数
    function validateEmail(email) {
        var re = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
        return re.test(email);
    }

    function validatePhone(phone) {
        var re = /^1[3-9]\d{9}$/;
        return re.test(phone);
    }


    // 全选功能
    $('#selectAll').on('click', function() {
        var checked = $(this).prop('checked');
        // 只选tbody里的复选框，不影响表头
        $('table.table tbody input[type="checkbox"]').prop('checked', checked);
    });

    // danger按钮点击事件
    $(document).on('click', '.btn-danger', function() {
        var index = $(this).data('index');
        if(window._currentUsers && typeof index !== 'undefined') {
            var user = window._currentUsers[index];
            // 禁止删除自己
            if(window.currentUsername && user.username === window.currentUsername) {
                showResult('警告', '不能删除自己的信息！', 'warning');
                return;
            }
            // 设置模态框内容
            $('#deleteUserModalBody').html('是否删除 <strong>' + user.username + '</strong> 的信息？');
            $('#confirmDeleteUserBtn').data('username', user.username);
            var modal = new bootstrap.Modal(document.getElementById('deleteUserModal'));
            modal.show();
        }
    });

    // 确认删除按钮事件
    $('#confirmDeleteUserBtn').on('click', function() {
        // 支持单个和批量
        var usernames = $(this).data('usernames');
        if (!usernames) {
            // 单个删除
            var username = $(this).data('username');
            if (!username) return;
            usernames = [username];
        }
        // 发送删除请求
        $.ajax({
            url: contextPath + '/API/user/delete',
            type: 'POST',
            data: { 'usernames[]': usernames },
            dataType: 'json',
            success: function(response) {
                // 关闭模态框
                var delModal = bootstrap.Modal.getInstance(document.getElementById('deleteUserModal'));
                delModal.hide();

                // 修改这里：检查code而不是success
                if (response.code === 200) {
                    showResult('成功', response.message || '删除成功', 'success');
                    // 刷新用户列表
                    loadUserData(currentPage, pageSize);
                } else {
                    showResult('错误', response.message || '删除失败', 'danger');
                }
            },
            error: function(xhr, status, error) {
                showResult('错误', '删除失败，请稍后重试', 'danger');
            }
        });
    });

    // 新增用户按钮点击事件
    $('#addUserBtn').on('click', function() {
        // 清空表单
        $('#addUserForm')[0].reset();
        // 显示新增用户模态框
        var modal = new bootstrap.Modal(document.getElementById('addUserModal'));
        modal.show();
    });

    // 保存用户按钮点击事件
    $('#saveUserBtn').on('click', function() {
        // 获取表单数据
        var username = $('#add-username').val();
        var password = $('#add-password').val();
        var email = $('#add-email').val();
        var phone = $('#add-phone').val();
        var status = $('#add-status').val();

        // 构建表单数据对象
        var formData = {
            username: username,
            password: password,
            email: email,
            phone: phone,
            status: status
        };

        // 验证必填字段
        if (!formData.username || !formData.password) {
            showResult('错误', '<span class="text-danger">用户名和密码不能为空</span>', 'danger');
            return;
        }

        // 添加邮箱和电话验证
        if (formData.email || formData.phone) {
            // 先验证邮箱或电话是否已被使用
            $.ajax({
                url: contextPath + '/API/verify',
                type: 'POST',
                data: {
                    EmailOrPhone: formData.email || formData.phone
                },
                dataType: 'json',
                success: function(response) {
                    if (response.code === 201) {
                        // 邮箱或电话已被使用
                        showResult('警告', response.message, 'warning');
                    } else {
                        // 邮箱或电话未被使用，可以继续添加用户
                        saveUserToServer(formData);
                    }
                },
                error: function(xhr, status, error) {
                    showResult('错误', '验证邮箱或电话失败，请稍后重试', 'danger');
                }
            });
        } else {
            // 没有填写邮箱和电话，直接保存
            saveUserToServer(formData);
        }
    });

    // 将保存用户的逻辑抽取为单独的函数
    function saveUserToServer(formData) {
        // 发送AJAX请求
        $.ajax({
            url: contextPath + '/API/user/insert',
            type: 'POST',
            data: formData,
            dataType: 'json',
            success: function(response) {
                if (response.code === 200) {
                    // 关闭模态框
                    var modal = bootstrap.Modal.getInstance(document.getElementById('addUserModal'));
                    modal.hide();

                    // 显示成功消息
                    showResult('成功', '用户添加成功', 'success');

                    // 重新加载用户数据
                    loadUserData(currentPage, pageSize);
                } else {
                    showResult('错误', response.msg || '添加用户失败', 'danger');
                }
            },
            error: function(xhr, status, error) {
                showResult('错误', '添加用户失败，请稍后重试', 'danger');
            }
        });
    }

});

// 显示结果消息
// 批量删除按钮点击事件（事件委托，确保动态渲染后依然有效）
$(document).on('click', '.btn-danger.batch-delete', function() {
    var checkedBoxes = $('table.table tbody input[type="checkbox"]:checked');
    var selectedUsers = [];
    checkedBoxes.each(function() {
        var rowIndex = $(this).closest('tr').index();
        if(window._currentUsers && typeof window._currentUsers[rowIndex] !== 'undefined') {
            selectedUsers.push(window._currentUsers[rowIndex]);
        }
    });

    if(selectedUsers.length === 0) {
        showResult('提示', '请先选择要删除的用户', 'warning');
        return;
    }

    // 获取所有选中用户的用户名
    var usernames = selectedUsers.map(function(user) { return user.username; });

    // 检查是否包含自己
    if(window.currentUsername && usernames.includes(window.currentUsername)) {
        showResult('警告', '不能删除自己的信息！', 'warning');
        return;
    }

    // 设置模态框内容
    var userListHtml = usernames.map(function(name) {
        return '<span class="badge bg-secondary me-1">' + name + '</span>';
    }).join('');
    $('#deleteUserModalBody').html('是否删除以下用户？<br>' + userListHtml);

    // 存储用户名数组到确认按钮
    $('#confirmDeleteUserBtn').data('usernames', usernames);

    // 显示模态框
    var modal = new bootstrap.Modal(document.getElementById('deleteUserModal'));
    modal.show();
});


// 显示结果消息
function showResult(title, message, type) {
    $('#resultModalTitle').text(title);
    $('#resultModalBody').html('<div class="alert alert-' + type + '">' + message + '</div>');
    var resultModal = new bootstrap.Modal(document.getElementById('resultModal'));
    resultModal.show();
}